<template>
  <div>
    <el-form ref="pram" :model="pram" :rules="rules" label-width="125px" @submit.native.prevent>
      <el-form-item label="任务类型" prop="taskType">
        <el-input v-model="pram.taskType" maxlength="100" placeholder="任务类型"/>
      </el-form-item>
      <el-form-item label="型号" prop="type">
        <el-input v-model="pram.type" maxlength="100" placeholder="型号"/>
      </el-form-item>
      <el-form-item label="检测时间" prop="detectionTime">
        <el-date-picker v-model="pram.detectionTime" value-format="yyyy/MM/dd" format="yyyy/MM/dd" size="small"
                        type="date" placement="bottom-end" style="width: 100%;" @change="onchangeSTime"
                        placeholder="试验日期"
        />
      </el-form-item>
      <el-form-item label="工作时间" prop="workTime">
        <el-time-picker v-model="pram.workTimeList" is-range value-format="HH:mm" format="HH:mm" size="small"
                        type="time" placement="bottom-end" style="width: 100%;" @change="onchangeWTime"
                        placeholder="工作时间"
        />
      </el-form-item>
      <el-form-item label="检测数量" prop="detectionNumber">
        <el-input v-model="pram.detectionNumber" maxlength="100" placeholder="检测数量"/>
      </el-form-item>
      <el-form-item label="责任单位" prop="department">
        <el-input v-model="pram.department" maxlength="100" placeholder="责任单位"/>
      </el-form-item>
<!--      <el-form-item label="备注" prop="remark">-->
<!--        <el-input v-model="pram.remark" type="textarea" :rows="5"/>-->
<!--      </el-form-item>-->
      <el-form-item label="序号">
        <el-input-number v-model="pram.number" :min="0"/>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="handlerSubmit('pram')"
        >{{ isCreate === 0 ? '确定' : '更新' }}
        </el-button>
        <el-button @click="close">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import * as api from '@/api/ammunition'
import { Debounce } from '@/utils/validate'

export default {
  components: {},
  props: {
    isCreate: {
      type: Number,
      required: true
    },
    id: {
      type: Number,
      required: true
    },
    allCategoryData: {
      type: Object
    },
    allTreeList: {
      type: Array
    }
  },
  data() {
    return {
      constants: this.$constants,
      pram: {
        taskType: null,
        type: null,
        detectionTime: null,
        detectionNumber: null,
        workTimeList: null,
        remark: null,
        department: '',
        id: 0,
        startTime: '',
        number: 0,
        endTime: ''
      },
      taskOption: [],
      rules: {
        // name: [{ required: true, message: '请填设备名称', trigger: ['blur', 'change'] }],
        // brand: [{ required: true, message: '请选择设备品牌', trigger: ['blur', 'change'] }],
        // device: [{ required: true, message: '请选择设备型号', trigger: ['blur', 'change'] }],
        // deviceType: [{ required: true, message: '请选择设备类型', trigger: ['blur', 'change'] }],
        // personId: [ { required: true, message: '请选择所属人', trigger: ['blur', 'change']} ],
        // serialization: [ { required: true, message: '请填机身串码', trigger: ['blur', 'change']} ],
        // mobile: [ { required: true, message: '请填手机号', trigger: ['blur', 'change']} ],
        // macAddress: [ { required: true, message: '请填Mac地址', trigger: ['blur', 'change']} ],
        // bluetoothAddress: [ { required: true, message: '请填蓝牙通讯地址', trigger: ['blur', 'change']} ],
      },
      parentOptions: [],
      categoryProps: {
        value: 'id',
        label: 'name',
        children: 'child',
        expandTrigger: 'hover',
        checkStrictly: true,
        emitPath: false
      },
      categoryData: {
        brandList: [],
        deviceList: [],
        deviceTypeList: [],
        personList: []
      },
      deviceList: []
    }
  },
  mounted() {
    this.getDropList()
    this.initEditData()
  },
  computed: {
    formattedStartTime: function() {
      return this.pram.startTime ? this.formatTime(this.pram.startTime) : '';
    },
    formattedEndTime: function() {
      return this.pram.endTime ? this.formatTime(this.pram.endTime) : '';
    }
  },
  methods: {
    formatTime: function(time) {
      const date = new Date(time);
      return `${this.padZero(date.getHours())}:${this.padZero(date.getMinutes())}`;
    },
    padZero: function(num) {
      return num.toString().padStart(2, '0');
    },
    close() {
      this.$emit('hideEditDialog')
    },
    onchangeSTime(e) {
      this.pram.detectionTime = e
    },
    onchangeWTime(e) {
      this.pram.workTimeList = e
    },
    initEditData() {
      this.parentOptions = [...this.allTreeList]
      if (this.isCreate === 1) {
        this.selectAmmunitionById()
      }

    },
    selectAmmunitionById() {
      api.selectAmmunitionByIdApi({ id: this.id }).then(data => {
        if (data) {
          this.pram = data
        }

      })
    },
    getDropList() {
      api.getDropListApi().then(data => {
        if (data) {
          this.taskOption = data.trainDescList
          let departmentId = data.trainDescList.departmentId
          this.taskOption.departmentId = parseInt(departmentId)
        }

      })
    },

    handlerSubmit: Debounce(function(form) {
      this.$refs[form].validate(valid => {
        if (!valid) return
        if (this.isCreate === 0) {
          this.handlerSave()
        } else {
          this.handlerEdit()
        }
      })
    }),
    handlerSave() {
      api.insertAndUpdateAmmunitionAip(this.pram).then(data => {
        this.$message.success('创建成功')
        this.$emit('hideEditDialog')
      })
    },
    handlerEdit() {
      api.insertAndUpdateAmmunitionAip(this.pram).then(data => {
        this.$message.success('更新成功')
        this.$emit('hideEditDialog')
      })
    }
  }
}
</script>

<style scoped>

</style>
